<!DOCTYPE html>
{# This file is part of INGInious. See the LICENSE and the COPYRIGHTS files for #}
{#  more information about the licensing of this file. #}
<html lang="en">
<head>
    {% block head %}
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="INGInious">
    <meta name="author" content="">
    <link rel="icon" href="{{ get_homepath(True) }}/static/icons/favicon.ico">
    <link rel="mask-icon" href="{{ get_homepath(True) }}/static/icons/wb.svg" color="#5E932E">

    <title>{% block title %}{% endblock %} | INGInious</title>

    <!-- Bootstrap -->
    <link href="{{get_homepath(True)}}/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="{{get_homepath(True)}}/static/css/bootstrap-datetimepicker.min.css" rel="stylesheet">

    <!-- Font Awesome -->
    <link href="{{get_homepath(True)}}/static/css/font-awesome.min.css" rel="stylesheet">

    <!-- INGInious Style -->
    <link href="{{get_homepath(True)}}/static/css/INGInious.css" rel="stylesheet">

    <!-- Codemirror Style -->
    <link href="{{get_homepath(True)}}/static/css/codemirror.css" rel="stylesheet">

    <!-- Icons -->
    <link rel="shortcut icon" href="{{get_homepath(True)}}/static/icons/favicon.ico">
    <link rel="apple-touch-icon" sizes="57x57" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="114x114" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="72x72" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="144x144" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="60x60" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="120x120" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="76x76" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="152x152" href="{{get_homepath(True)}}/static/icons/apple-touch-icon-152x152.png">
    <link rel="icon" type="image/png" href="{{get_homepath(True)}}/static/icons/favicon-196x196.png" sizes="196x196">
    <link rel="icon" type="image/png" href="{{get_homepath(True)}}/static/icons/favicon-160x160.png" sizes="160x160">
    <link rel="icon" type="image/png" href="{{get_homepath(True)}}/static/icons/favicon-96x96.png" sizes="96x96">
    <link rel="icon" type="image/png" href="{{get_homepath(True)}}/static/icons/favicon-16x16.png" sizes="16x16">
    <link rel="icon" type="image/png" href="{{get_homepath(True)}}/static/icons/favicon-32x32.png" sizes="32x32">
    <meta name="msapplication-TileColor" content="#00a300">
    <meta name="msapplication-TileImage" content="{{get_homepath(True)}}/static/icons/mstile-144x144.png">
    <meta name="msapplication-config" content="{{get_homepath(True)}}/static/icons/browserconfig.xml">

    {% if sentry_io_url %}
    <script src="{{get_homepath(True)}}/static/js/libs/sentry-io-bundle.min.js" type="text/javascript" charset="utf-8"></script>
    <script>
        Sentry.init({ dsn: "{{sentry_io_url}}" });
        {% if user_manager.session_logged_in() %}
            Sentry.configureScope(function(scope) {
                scope.setUser({
                    "username": "{{user_manager.session_username()}}",
                    "realname": "{{user_manager.session_realname()}}"
                })
            });
        {% endif %}
    </script>
    {% endif %}

    {% if use_minified %}
    <script src="{{get_homepath(True)}}/static/js/all-minified.js"></script>
    {% else %}
    <script src="{{get_homepath(True)}}/static/js/libs/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/libs/jquery.form.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/codemirror/codemirror.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/codemirror/mode/meta.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/libs/popper.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/libs/moment.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/libs/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/libs/bootstrap-datetimepicker.min.js" type="text/javascript" charset="utf-8"></script>
    <script src='{{get_homepath(True)}}/static/js/libs/jquery-sortable.min.js' type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/checked-list-group.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/common.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/task.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/webapp.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/studio.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/audiences.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{get_homepath(True)}}/static/js/groups.js" type="text/javascript" charset="utf-8"></script>
    {% endif %}

    <script type="text/javascript">
        CodeMirror.modeURL = "{{get_homepath(True)}}/static/js/codemirror/mode/%N/%N.js";
    </script>

    {{ template_helper.call('css') }}
    {{ template_helper.call('javascript_header') }}
    {{ template_helper.call('header_hook') }}
    {% endblock %}
</head>

<body>

    <div class="navbar navbar-expand-sm bg-dark navbar-dark bg-dark">
        <div class="container-fluid">
            <a class="navbar-brand" href="{{ get_homepath() }}/index"><img src="{{get_homepath(True)}}/static/images/header.png" alt="logo"/> INGInious</a>

            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation" style="">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarResponsive">
            {% block navbar %}{% endblock %}
            {% if user_manager.session_logged_in() %}
                <ul class="nav navbar-nav navbar-right ml-auto">
                    <li class="nav-item"><a href="{{ get_homepath() }}/courselist" class="nav-link"><i class="fa fa-th-list fa-fw"></i> {{ _("Course list") }}</a></li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" id="dropdownMenuButton">
                            <i class="fa fa-user fa-fw"></i> {{ user_manager.session_realname() }} <span class="caret"></span>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right"  aria-labelledby="dropdownMenuButton">
                            <a class="dropdown-item" href="{{ get_homepath() }}/mycourses"><i class="fa fa-th-list fa-fw"></i> {{ _("My courses") }}</a>
                            <a class="dropdown-item" href="{{ get_homepath() }}/preferences"><i class="fa fa-gears fa-fw"></i> {{ _("Preferences") }}</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="{{ get_homepath() }}/queue"><i class="fa fa-dashboard fa-fw"></i> {{ _("Service status") }}</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="{{ get_homepath() }}/logout" id="logoff_button"><i class="fa fa-sign-out"></i> {{ _("Log out") }}</a>
                        </div>
                    </li>
                </ul>
            {% else %}
                <!-- <ul class="nav navbar-nav navbar-right ml-auto">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" id="dropdownMenuButton">
                            <i class="fa fa-globe fa-fw"></i> {{ _("English") }}<span class="caret"></span>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right"  aria-labelledby="dropdownMenuButton">
                            {% for code, language in available_languages.items() %}
                            <a href="?lang={{code}}" class="dropdown-item"><i class="fa fa-chevron-right fa-fw"></i> {{ code }} ({{ language }})</a>
                            {% endfor %}
                        </div>
                    </li> -->

                    <li class="nav-item"><a href="{{ get_homepath() }}/courselist" class="nav-link"><i class="fa fa-th-list fa-fw"></i> {{ _("Course list") }}</a></li>
                    {% if allow_registration %}
                    <li class="nav-item"><a href="{{ get_homepath() }}/register" class="nav-link"><i class="fa fa-pencil fa-fw"></i> {{ _("Register") }}</a></li>
                    {% endif %}
                    <li class="nav-item"><a href="{{ get_homepath() }}/signin" class="nav-link"><i class="fa fa-sign-in fa-fw"></i> {{ _("Sign in") }}</a></li>
                </ul>
            {% endif %}
            </div>
        </div>
    </div>


    <div class="container-fluid" role="main" style="margin-top: 20px; margin-bottom: 65px;">
        {% if self.column() %}
            <div class="row">
                <div class="col-lg-9 col-md-7 col-sm-6">
        {% endif %}
        {% block content %}{% endblock %}
        {% if self.column() %}
                </div>
                <div class="col-lg-3 col-md-5 col-sm-6 position-sticky">
                    <div class="sticky-top">
                        {% block column %}{% endblock %}
                    </div>
                </div>
            </div>
        {% endif %}
    </div>

    <div id="footer" class="navbar navbar-expand-sm bg-dark navbar-dark bg-dark">
        <div class="container-fluid">
            <p class="navbar-text">
                &copy; 2014-2020 Universit&eacute; catholique de Louvain
            </p>
            <p class="navbar-text">
                <a target="_blank" href="http://www.inginious.org" class="navbar-link">
                    {{ _("INGInious is distributed under AGPL license") }}
                </a>
            </p>
        </div>
    </div>

    <!-- Placed at the end of the document so the pages load faster -->
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    {{ template_helper.call('javascript_footer') }}
</body>
</html>
